﻿<fieldset class="table-search-fieldset">
    <legend>搜索信息</legend>
    <form class="layui-form layui-form-pane" action="">
        <div class="layui-form-item" style="margin-bottom: 0px;">
            <div class="layui-inline">
                <div class="layui-input-inline">
                    <input type="text" name="RoleName" placeholder="角色名称" autocomplete="off" class="layui-input">
                </div>
            </div>
            <div class="layui-inline">
                <button type="button" class="layui-btn layui-btn-primary" id="btnQuery"><i class="layui-icon layui-icon-search"></i>搜索</button>
                <button type="reset" class="layui-btn layui-btn-primary">重置</button>
            </div>
        </div>
    </form>
</fieldset>
<table class="layui-hide" id="datatable" lay-filter="datatable"></table>
<script type="text/html" id="toolbar">
    <div class="layui-btn-container">
        <button class="layui-btn layui-btn-sm" lay-event="add"> 新增角色 </button>
    </div>
</script>
<script type="text/html" id="tablebar">
    <a class="layui-btn layui-btn-warm layui-btn-xs" lay-event="edit">修改</a>
    <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
</script>
<script src="/js/datatable.js" charset="utf-8"></script>
<script>
    layui.use(function () {
        var $ = layui.jquery,
            table = layui.table;
        var options = {
            url: "/SysRole/Index",
            page: false,
            cols: [
                [
                    {
                        field: 'RoleName',
                        title: '角色名称'
                    },
                    {
                        field: 'ResourceIds',
                        title: '资源权限(模块编号)'
                    },
                    {
                        field: 'AddTime',
                        title: '添加时间'
                    },
                    {
                        field: 'UpdateTime',
                        title: '最后更新时间'
                    },
                    {
                        templet: '#tablebar',
                        width: 150,
                        align: 'center',
                        title: '操作'
                    }
                ]
            ]
        };
        layui.dataTable(options);

        //监听头部事件
        table.on('toolbar(datatable)', function (obj) {
            switch (obj.event) {
                case 'add':
                    var index = layer.open({
                        type: 2,
                        title: '新增角色',
                        area: ['600px', '620px'],
                        content: "/SysRole/Add",
                        end: function () {
                            layui.tableReload();
                        }
                    });
                    break;
            };
        });
        table.on('tool(datatable)', function (obj) {
            var data = obj.data;
            if (obj.event === 'edit') {
                var index = layer.open({
                    type: 2,
                    title: '修改角色',
                    area: ['600px', '620px'],
                    content: "/SysRole/Edit/" + data.Id,
                    end: function () {
                        layui.tableReload();
                    }
                });
                return false;
            } else if (obj.event === 'del') {
                layer.confirm('确定删除该条数据吗？', function (index) {
                    $.ajax({
                        url: '/SysRole/Delete/' + data.Id,
                        success: function (res) {
                            if (res.Code == 200) {
                                layer.msg('删除成功');
                                obj.del();
                            } else {
                                layer.msg(res.Message);
                            }
                        }
                    });
                });
            }
        });

    });
</script>